
<%@ include file="/WEB-INF/jsp/include/page_header.jspf" %>
<%@ taglib uri="http://displaytag.sf.net" prefix="display" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">


<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>.: Portal Kerjaya :.</title>
        <link type="text/css" href="${pageContext.request.contextPath}/pub/style/cupertino/jquery-ui-1.8.16.custom.css" rel="stylesheet" />
        <script type="text/javascript" src="${pageContext.request.contextPath}/pub/js/jquery-ui-1.8.16.custom.min.js"></script>

        <script type="text/javascript">    
            $(document).ready(function() {                      
                var $t = $( "#tabs" ).tabs();                  
                $t.tabs('select',${actionBean.tabSelected});
                $("form").submit(function() {
                    return formValidation();
                });
                
                $('#addCompany').click(function(){            
                    $('#companyDialog').dialog('open');
                });
                
                
                $("#companyDialog").dialog({
                    autoOpen: false,
                    height: 500,
                    width: 800,
                    modal: true,
                    buttons: {
                        'Tutup' : function() {
                            $(this).dialog('close');
                        },

                        'Simpan': function() {
                            var selected = $t.tabs("option", "selected");
                            frm = document.form1;
                            frm.tabSelected.value = selected;
                            frm.submit();
                        }
                    },
                    close: function() {                       
                    }
                });
                
            });       
        </script>
    </head>
    <body>
        <s:messages/>
        <s:errors/>
        <div class="demo">
            <s:useActionBean beanclass="com.jkoa.util.ListUtil" var="list"/>            
            <s:form beanclass="com.jkoa.stripes.action.MaklumatPeribadiAction" name="form1">
                <s:hidden name="tabSelected" id="tabSelected"/>
                <div id="tabs">
                    <ul>
                        <li><a href="#tabs-1">Maklumat Peribadi</a></li>
                        <c:if test="${empty baru}">
                            <li><a href="#tabs-2">Maklumat Akademik</a></li>
                            <li><a href="#tabs-3">Pengalaman Pekerjaan</a></li>
                        </c:if>
                    </ul>
                    <div id="tabs-1">
                        <table>
                            <tr>
                                <td width="200px" style="text-align: right"><font color="Red">*</font>Nama</td>
                                <td>:</td>
                                <td><s:text name="peribadi.nama" style="width:400px" class="required"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>Jenis Pengenalan</td>
                                <td>:</td>
                                <td>
                                    <s:select name="peribadi.kodPengenalan.kod" class="required">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiPengenalan}" label="nama" value="kod"/>
                                    </s:select>
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>No Pengenalan</td>
                                <td>:</td>
                                <td><s:text name="peribadi.noPengenalan" 
                                        style="width:400px" class="required"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">Tarikh Lahir</td>
                                <td>:</td>
                                <td><s:text name="peribadi.trhLahir" style="width:100px" 
                                        class="datepicker" formatType="date" formatPattern="dd/MM/yyyy"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>Alamat Surat-Menyurat</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamatSurat" style="width:400px" class="required"/></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamatSurat2" style="width:400px"/></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamatSurat3" style="width:400px"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">&nbsp;<font color="Red">*</font>Bandar</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamatSurat4" style="width:400px" class="required"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>Poskod</td>
                                <td>:</td>
                                <td><s:text name="peribadi.poskodSurat" style="width:400px" maxlength="5" class="required"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>Negeri</td>
                                <td>:</td>
                                <td><s:select name="peribadi.negeriSurat.kod" class="required">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiNegeri}" label="nama" value="kod"/>
                                    </s:select>
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>Alamat Tetap</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamat" style="width:400px" class="required"/></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamat2" style="width:400px"/></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamat3" style="width:400px"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">&nbsp;<font color="Red">*</font>Bandar</td>
                                <td>:</td>
                                <td><s:text name="peribadi.alamat4" style="width:400px" class="required"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>Poskod</td>
                                <td>:</td>
                                <td><s:text name="peribadi.poskod" style="width:400px" maxlength="5" class="required"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right"><font color="Red">*</font>Negeri</td>
                                <td>:</td>
                                <td><s:select name="peribadi.negeri.kod" class="required">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiNegeri}" label="nama" value="kod"/>
                                    </s:select></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">Email</td>
                                <td>:</td>
                                <td><s:text name="peribadi.email" style="width:400px"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">No Tel Rumah</td>
                                <td>:</td>
                                <td><s:text name="peribadi.noTel1" style="width:400px"/></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">No Tel Pejabat</td>
                                <td>:</td>
                                <td><s:text name="peribadi.noTel2" style="width:400px"/></td>
                            </tr>                            
                            <tr>
                                <td style="text-align: right">Warganegara</td>
                                <td>:</td>
                                <td><s:select name="peribadi.warganegara.kod">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiWarganegara}" label="nama" value="kod"/>
                                    </s:select></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">Jantina</td>
                                <td>:</td>
                                <td><s:select name="peribadi.jantina.kod">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiJantina}" label="nama" value="kod"/>
                                    </s:select></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">Taraf Perkahwinan</td>
                                <td>:</td>
                                <td><s:select name="peribadi.tarafKahwin.kod">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiTarafKahwin}" label="nama" value="kod"/>
                                    </s:select></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">Suku Kaum</td>
                                <td>:</td>
                                <td><s:select name="peribadi.suku.kod">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiSuku}" label="nama" value="kod"/>
                                    </s:select></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">Agama</td>
                                <td>:</td>
                                <td><s:select name="peribadi.agama.kod">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:options-collection collection="${list.senaraiAgama}" label="nama" value="kod"/>
                                    </s:select></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">Kecacatan</td>
                                <td>:</td>
                                <td><s:select name="peribadi.kecacatan">
                                        <s:option value="">Sila Pilih</s:option>
                                        <s:option value="T">Tiada</s:option>
                                        <s:option value="Y">Ya</s:option>
                                    </s:select></td>
                            </tr>
                            <tr>
                                <td style="text-align: right">&nbsp;</td>
                                <td>&nbsp;</td>
                                <td><s:submit name="savePeribadi" value="Simpan" class="btn fix_width"/></td>
                            </tr>
                        </table>                        
                    </div>
                    <c:if test="${empty baru}">
                        <div id="tabs-2">

                        </div>
                        <div id="tabs-3">
                            <table>
                                <tr>
                                    <td style="text-align: right">No KWSP (jika ada)</td>
                                    <td>:</td>
                                    <td><s:text name="peribadi.trhLahir"/></td>                                
                                </tr>
                                <tr>
                                    <td style="text-align: right">No Perkeso (jika ada)</td>
                                    <td>:</td>
                                    <td><s:text name="peribadi.trhLahir"/></td>                                
                                </tr>
                                <tr>
                                    <td colspan="3">&nbsp;</td>                                                              
                                </tr>
                                <tr>
                                    <td align="center" colspan="3">
                                        <display:table class="tablecloth" style="width:100%; border:0px;  bordercolor:#BBB;" 
                                                       name="${actionBean.senaraiPengalaman}" pagesize="10"
                                                       cellpadding="0" cellspacing="0" id="line"
                                                       requestURI="/maklumat_peribadi">
                                            <display:column title="Bil">${line_rowNum}</display:column>
                                            <display:column property="namaSyarikat" title="Syarikat"/>
                                            <display:column property="jawatan" title="Jawatan"/>
                                            <display:column property="trhMula" title="Tarikh Mula Bekerja"/>
                                            <display:column property="trhAkhir" title="Tarikh Akhir Bekerja"/>
                                            <display:column property="ulasanKerja" title="Ringkasan Pekerjaan"/>
                                        </display:table>
                                    </td>
                                </tr>
                                <tr>
                                    <td style="text-align: right">&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td><s:button name="addCompany" value="Tambah Majikan" id="addCompany" class="buttons"/></td>
                                </tr>                           
                            </table> 
                        </div>  
                    </c:if>
                </div>
                <div id="companyDialog" style="display: none" align="left" title="Tambah Syarikat">                                                             
                    <table>
                        <tr>
                            <td style="text-align: right">Jawatan</td>
                            <td>:</td>
                            <td><s:text name="pengalaman.jawatan"/></td>                                
                        </tr> 
                        <tr>
                            <td style="text-align: right">Bidang</td>
                            <td>:</td>
                            <td><s:select name="pengalaman.bidang">
                                    <s:option value="">Sila Pilih</s:option>
                                    <s:options-collection collection="${list.senaraiBidang}" label="nama" value="kod"/>
                                </s:select>
                            </td>                                
                        </tr>
                        <tr>
                            <td style="text-align: right">Nama Syarikat</td>
                            <td>:</td>
                            <td><s:text name="pengalaman.namaSyarikat"/></td>                                
                        </tr> 
                        <tr>
                            <td style="text-align: right">Alamat Syarikat</td>
                            <td>:</td>
                            <td><s:text name="pengalaman.alamatSyarikat1"/></td>                                
                        </tr> 
                        <tr>
                            <td style="text-align: right">&nbsp;</td>
                            <td></td>
                            <td><s:text name="pengalaman.alamatSyarikat2"/></td>                                
                        </tr> 
                        <tr>
                            <td style="text-align: right">&nbsp;</td>
                            <td></td>
                            <td><s:text name="pengalaman.alamatSyarikat3"/></td>                                
                        </tr> 
                        <tr>
                            <td style="text-align: right">&nbsp;</td>
                            <td></td>
                            <td><s:text name="pengalaman.alamatSyarikat4"/></td>                                
                        </tr> 
                        <tr>
                            <td style="text-align: right">Poskod</td>
                            <td>:</td>
                            <td><s:text name="pengalaman.poskodSyarikat"/></td>                                
                        </tr> 
                    </table>
                </div>
            </s:form>
        </div>
    </body>
</html>
